<?xml version="1.0" encoding="utf-8" ?>
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<jsp:include page="/commonPart/htmlHeader2.jsp">
	<jsp:param name="title" value="${visitorStatus.id == userInfo.id ? '我' : userInfo.name}关注的人-${userInfo.name}的个人空间-CommonWorld" />
</jsp:include>
<body>
<div id = "CW_Screen" >
	<jsp:include page= "/commonPart/bodyHeader2.jsp" ></jsp:include>
	<div id = "CW_Content">
		<div id = "SpaceLeft">
			<c:choose>
				<c:when test = "${visitorStatus.id == userInfo.id}">
					<jsp:include page = "/commonPart/MySpaceLeft.jsp" ></jsp:include>
				</c:when>
				<c:otherwise>
					<jsp:include page = "/commonPart/OtherSpaceLeft.jsp" ></jsp:include>
				</c:otherwise>
			</c:choose>
			<jsp:include page = "/commonPart/HomeSpaceLeft.jsp"></jsp:include>
		</div>
		<div class = "SpaceList UserList">
			<div class = "TopBar">
				<div class = "NavPath">
					<a href = "${userUrls.home}">空间</a> >>
					<a href = "${userUrls.fellow}">${visitorStatus.id == userInfo.id ? '我' : userInfo.name}关注的人</a>
				</div>
			</div>
			<h1>
				${visitorStatus.id == userInfo.id ? '我' : userInfo.name}关注的人 <span class = "SubTitle">共有<span>${socialInfo.fellowsCount}</span>人</span>
			</h1>
			<ul>
				<c:forEach items="${fellows}" var="fellow">
					<li id = "fellow_${fellow.id}">
						<table class = "ostable">
							<tr>
								<td class = "avatar">
									<a href = "${fellow.urls.home}" target="_blank">
										<img src = "${fellow.headImage}" align = "absmiddle" alt = "${fellow.name}" title = "${fellow.name}" class = "SmallPortrait" user = "${fellow.id}" />
									</a>
								</td>
								<td class = "update" style = "vertical-align: middle;">
									<span class = "name">
										<a href = "${fellow.urls.home}" target="_blank">${fellow.name}</a>
									</span>
									<span class = "city">${fellow.address}</span>
								</td>
								<td class = "opts" style = "text-align: right; vertical-align: ${visitorStatus.id == userInfo.id ? 'top' : 'middle'}">
									<c:if test="${visitorStatus.id == userInfo.id}">
										<a href = "javascript:unfollow_user(${fellow.id}, '${fellow.name}')">取消关注</a>
									</c:if>
									<a href = "javascript:sendmsg(${fellow.id}, '${fellow.name}')">发送留言</a>
								</td>
								
							</tr>
						</table>
					</li>
				</c:forEach>
			</ul>
			<script>
				function unfollow_user(followId, followName) {
					if (!confirm('确定要取消对' + followName + '的关注吗？'))
						return;
					ajax_post('/action/social/unfollow', 'followId=' + followId, function(html) {
						if (html == '1') {
							$('#fellow_' + followId).fadeOut();
							var count = parseInt($('.SubTitle span').html()) - 1;
							$('.SubTitle span').html(count);
						}
					});
				}
			</script>
			<ul class = "pager">
				<c:if test="${currentPage > 1}">
					<li class = "page prev">
						<a href = "?p=${currentPage - 1}">&lt;</a>
					</li>
				</c:if>
				<c:if test = "${beginIndex > 1 }">
					<li class = "page">
						<a href = "?p=1">1</a>
					</li>
				</c:if>
				<c:forEach items="${pages}" var = "page">
					<li class = "page ${currentPage == page ? 'current' : ''}">
						<a href = "?p=${page}">${page}</a>
					</li>
				</c:forEach>
				<c:if test = "${endIndex < totalPage}">
					<li class = "page">
						<a href = "?p=${totalPage}">${totalPage}</a>
					</li>
				</c:if>
				<c:if test = "${currentPage < totalPage}">
					<li class = "page next">
						<a href = "?p=${currentPage + 1}">&gt;</a>
					</li>
				</c:if>
			</ul>
		</div>
		<c:if test= "${visitorStatus.id == userInfo.id}">
			<jsp:include page="/commonPart/sendMsg.jsp"></jsp:include>
		</c:if>
	</div>	
	<div class = "clear"></div>
	<div id = "footer"></div>
</div>
</body>
</html>